var _inherit = require('core/inherit.js');
var _UIContainer = require('component/uicontainer.js');
var _layout = require('tools/layout.js');
var _relative = _layout.relative;
var _vec3f = require('core/glm.js').vec3f;

var TWEEN = require('third_party/tweenjs/tween.js');
var _Helper = require('third_party/tweenjs/helper.js');

var _Constance = require('./constance.js');
var _global = require('global/global.js');
var R = require('res/texture.js').R;
var _UIUtils = require('scenes/game/utils.js');

// ==========================
// WidgetAnima
// ==========================
function WidgetAnima(view, x, y) {
    this.mView = view;
    this.mVector = _Helper.createPoint();
    this.mVector.setDirection(x, y);
    this.mVector.setPosition(this.mView.getPosition());
}
WidgetAnima.prototype.update = function (dis) {
    this.mView.setPosition(this.mVector.getPosition(dis));
    this.mView.touchMatrix();
};

// ==========================
// Title
// ==========================
function Title() {
    _UIContainer.call(this);

    this.addChild(this.mMenu = _UIUtils.greenButton('menu', 'Menu'));
    this.addChild(this.mRetry = _UIUtils.redButton('retry', 'Retry'));
    this.addChild(this.mNext = module.$('./nextcell.js'));

    this.mMenu.setAnchor(0.5, 0.5);
    this.mRetry.setAnchor(0.5, 0.5);
    this.mNext.setAnchor(0.5, 1);
    this.layout();

    this.mAnimas = [];
    this.mAnimas.push(new WidgetAnima(this.mMenu, -1, 0));// retry
    this.mAnimas.push(new WidgetAnima(this.mRetry, 1, 0));// menu
    this.mAnimas.push(new WidgetAnima(this.mNext, 0, 1));// next

    this.move = 0;
}
_inherit(Title, _UIContainer);
Title.prototype.onNextCell = function (count) {
    this.mNext.updateNext(count);
};
Title.prototype.layout = function () {
    this.setSize(_Constance.headerSize);
    _relative.local.layoutTo(this.mMenu, 1, 0.5, this, 0.5, 0.5, -80, 0);
    _relative.local.layoutTo(this.mRetry, 0, 0.5, this, 0.5, 0.5, 80, 0);
    _relative.local.layoutTo(this.mNext, 0.5, 1, this, 0.5, 1);
};

Title.prototype.onButtonsShowing = function () {
    this.mAnimas[0].update(this.move);
    this.mAnimas[1].update(this.move);
};
Title.prototype.onNextShowing = function () {
    this.mAnimas[2].update(this.move);
};
Title.prototype.onHidding = function () {
    for (var i = 0; i < this.mAnimas.length; i++) {
        this.mAnimas[i].update(this.move);
    }
};

Title.prototype.showButtons = function () {
    this.move = 180;
    new TWEEN.Tween(this)
        .to({move: 0}, 0.66)
        .easing(TWEEN.Easing.Sinusoidal.Out)
        .onUpdate(this.onButtonsShowing)
        .start();
};
Title.prototype.showNext = function () {
    this.move = 180;
    this.mAnimas[0].update(this.move);
    this.mAnimas[1].update(this.move);
    new TWEEN.Tween(this)
        .to({move: 0}, 0.66)
        .easing(TWEEN.Easing.Sinusoidal.Out)
        .onUpdate(this.onNextShowing)
        .start();
};
Title.prototype.hideAll = function () {
    new TWEEN.Tween(this)
        .to({move: 180}, 0.66)
        .easing(TWEEN.Easing.Sinusoidal.In)
        .onUpdate(this.onHidding)
        .start();
};

module.exports = Title;